<template>
	<view class="content">
		<z-paging ref="paging" v-model="dataList" @query="productData">
			<view class="top-box">
				<view class="slogan-box">
				</view>

			</view>
			<view class="searchStyle">
				<uni-easyinput prefixIcon="search" v-model="value" placeholder="请输入药品名称" @confirm="searchList">
				</uni-easyinput>
			</view>
			<view class="product-list" v-if="dataList.length>=0">
				<product-cell v-for="(item,index) in dataList" :key="index" :list="item" @click="details(item)"
					@addCart="addCartFun"></product-cell>
			</view>
			<view class="float-button-box" style="text-align: center;">
				<uni-badge size="small" style="width: 100%;" :offset="[5,15]" :text="carNum" absolute="rightTop"
					type="error">
					<image @click="cartFun" src="../../static/images/add_to_cart3.png" mode=""></image>
				</uni-badge>
			</view>
		</z-paging>
	</view>
</template>
<script>
	import {
		ref
	} from 'vue';
	import {
		qzApi
	} from '@/config/request.js';
	export default {
		data() {
			return {
				dataList: [],
				seachVal: "",
				carNum: 0,
				paging: "",
				value: '',
				displayMode: 1,
				biz: '', // 业务类型，可选值有 RX == 问诊，需要跳转进入问诊流程， DRUG == 购药， ORDER == 订单详情
				orderId: '', // 用于跳转的到订单详情页面的orderId，由小程序传进来
				idCard: '',
				openId: '',
				phone: '',
				userAccount: '',
				tokenKey: '',
				userName: '',
				token: "",
				referer: '',
			}
		},
		methods: {
			// 数据列表
			async productData(pageNo, pageSize) {
				let form = {
					displayMode: this.displayMode,
					name: this.value,
					pageNum: pageNo,
					pageSize: pageSize
				}
				try {
					const data = await qzApi.productList(form);
					this.$refs.paging.complete(data.data);
					// productList.value = data.data
				} catch (error) {}
			},
			searchList() {
				this.displayMode = null
				this.$refs.paging.reload();
			},
			// 购物车数量
			async cartNum() {
				const data = await qzApi.getQuantityInCart();
				this.carNum = data.data
			},
			// 添加购物车
			async addCartFun(data) {
				let form = {
					quantity: 1,
					skuId: data.id
				}
				try {
					const data = await qzApi.addToCart(form);
					console.log(data.code)
					if (data.code == 0) {
						uni.showToast({
							title: '添加成功',
							icon: 'success',
							duration: 2000, //提示的延迟时间，单位毫秒，默认：1500
							mask: false,
							// image:'./image.png',//自定义图标的本地路径
						});
						this.cartNum()
					} else {
						uni.showToast({
							title: data.msg,
							icon: 'none',
							duration: 2000, //提示的延迟时间，单位毫秒，默认：1500
							mask: false,
							// image:'./image.png',//自定义图标的本地路径
						});
					}


				} catch (error) {

				}
			},
			// 详情页
			cartFun() {
				uni.navigateTo({
					url: "/page1/product/cart?type=1"
				})
			},
			details() {
				uni.navigateTo({
					url: "/page1/product/index?id=" + item.id
				})
			},
			gotoConsultationInfo() {
				uni.navigateTo({
					url: '/pages/consultationInfo/consultationInfo',
				})
			},
			gotoOrderDetail(orderId) {
				uni.navigateTo({
					url: "/page1/order/index?id=" + orderId
				})
			},
			//登录
			async loginRequest() {
				let param = {
					idCard: this.idCard,
					openId: this.openId,
					phone: this.phone,
					tokenKey: this.tokenKey,
					userAccount: this.userAccount,
					userName: this.userName,
					referer: this.referer
				}
				try {
					const data = await qzApi.login(param);
					console.log(data.data.token)
					this.token = data.data.token
					if (data.code == 0) {
						uni.setStorageSync('token', data.data.token)
						uni.setStorageSync('userName', data.data.userInfo.name)
						if (this.biz == 'DRUG' || this.biz == null || this.biz == '') {
							this.cartNum()
						} else if (this.biz == 'ORDER') {
							if (this.orderId) {
								this.gotoOrderDetail(this.orderId)
							} else {
								uni.showToast({
									title: '订单ID为空',
									icon: 'eror',
									duration: 2000
								});
							}
						} else if (this.biz == 'RX') {
							this.gotoConsultationInfo()
						}
					}
				} catch (error) {}
			},

		},
		onLoad(options) {
			console.log(options,"ee")
			this.idCard = options.idCard
			this.openId = options.openId
			this.phone = options.phone
			this.referer = options.referer?options.referer:'db_miniapp_1'
			this.userName = options.userName;
			this.tokenKey=options.tokenKey;
			this.userAccount=options.userAccounts;
			uni.setStorageSync('openId', options.openId)
			uni.setStorageSync('phone', options.phone)
			uni.setStorageSync('userName', options.userName)
			uni.setStorageSync('tokenKey', options.tokenKey)
			uni.setStorageSync('userAccounts', options.userAccounts)
			uni.setStorageSync('biz', options.biz)
			uni.setStorageSync('idCard', options.idCard)
			if (options.biz) {
				this.biz = options.biz
				uni.setStorageSync('BIZ_TYPE', options.biz)
				if (options.biz == 'ORDER' && options.qzOrderId) {
					this.orderId = options.qzOrderId
				}
				if (options.biz == 'RX' && options.claimNumber) {
					uni.setStorageSync('DB_CLAIM_NUMBER', options.claimNumber)
				}
			}
			
			this.cartNum()
			this.loginRequest()
		},
		onShow() {
			this.cartNum()
		}
	}
</script>

<style>
	/* pages/home/home.wxss */

	.top-box {
		/* background-color: #2893ff; */
		background-color: var(--themeColor);
		/* background-color: #4fc08d; */
		height: 0;
	}

	.searchStyle {
		padding: 20upx;
		background-color: var(--themeColor);
	}

	.slogan-box {
		padding-top: 90rpx;
		padding-left: 40rpx;
		font-size: 40rpx;
		/* background-color: burlywood; */
		display: flex;
		align-items: center;
	}

	.float-btn-box {
		position: fixed;
		bottom: 100rpx;
		right: 100rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		/* background-color:burlywood; */
	}

	.cart-btn {
		width: 60rpx;
		height: 60rpx;
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.logo-image {
		width: 80rpx;
		height: 80rpx;
		margin-right: 20rpx;
	}

	.float-button-box {
		position: fixed;
		width: 120rpx;
		height: 120rpx;
		border-radius: 50%;
		background: #fff;
		right: 20rpx;
		bottom: 120rpx;
		z-index: 222;
		box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);

	}

	.float-button-box image {
		display: block;
		width: 60rpx;
		height: 60rpx;
		margin: auto;
		margin-top: 30rpx;

	}
</style>